<template>
    <el-form :inline="true" size="small" v-if="props.data.pid !== 0 && props.data.id !== undefined">
      <el-table :loading="loading" :data="tableData" style="width: 98%;" size="small" row-key="id">
        <el-table-column>
          <template #default="scope">
            <div style="display: flex; flex-direction: column;">
              <p><span>第{{ scope.$index + 1 }}题: </span></p>
              <div style="margin-left: 2em">{{ scope.row.homeworkTopic }}</div>
              <p>参考答案：</p>
              <div style="margin-left: 2em">{{ scope.row.homeworkAnswer }}</div>
            </div>
          </template>
        </el-table-column>
      </el-table>
        <el-button @click="publishHomework">发布作业</el-button>
    </el-form>
</template>

<script setup>
import { reactive, ref,watch } from "vue";
import axios from "@/axios/index.js"
import { onMounted } from "vue";
import { ElMessage } from 'element-plus'
let tableData = reactive([])
const props = defineProps({
  data: {},
  classId: {
    type: String,
    default: ''
  },
  permissions:{
    type: String,
  }
});
onMounted(loadTableData);
watch(() =>props.data.id, loadTableData);
let loading=ref(false)
  
  function loadTableData() {
    loading.value = true;
    if (props.data.pid !== 0) {
      axios.get("/courseHomework/selectAll", {
      params: {
        courseId:props.data.id
      }
    }).then(resp => {
      tableData = resp.data.data.records;
      loading.value = false;
    });
    }
  }

  function publishHomework() {
    if (props.permissions == 0){
        ElMessage({
          message: '无权操作',
          type: 'warning',
        })
        return;
      }
  const homeworkIds = tableData.map((item) => item.id);

  if (props.data.id===undefined) {
    ElMessage.error("未选择课程")
    return
  }
  
if (homeworkIds.length===0) {
    ElMessage.info("该课程无可发布作业")
    return
}
  
  axios
  .get("courseHomework/selectStudent", {
      params: {
        classId: props.classId,
      },
    })
  .then((response) => {
    
      if (response.data.data.length === 0) {
        ElMessage.error("该班没有学生加入");
        return;
      }
      const studentIds = response.data.data.map((item) => item.studentId); 
      axios
      .post("courseHomeworkRecord/addStudentWork", {
          studentIds: studentIds,
          homeworkIds: homeworkIds,
        })
      .then((resp) => { 
        if (resp.data.message==='添加失败') {
          ElMessage.error("已发布过该作业");
          return
        }  
          ElMessage.success("发布成功");
          // 更新已发布状态
          homeworkIds.forEach((id) => {
            const item = tableData.find((item) => item.id === id);
            if (item) {
              item.published = true;
            }
          });
        })
    });
}

  onMounted(() => loadTableData());
  </script>

  <style scoped lang="less">
  .el-table {
    margin: auto;
  }

  .el-form-item {
    margin-left: 15px;
  }

  .box {
  .el-pagination {
      display: flex;
      justify-content: center;
    }
  }
  </style>